<template>
  <div>
    <f-form ref='supplierBondForm' :action='api.payment' :form-key='this.formItem.paymentId' handler-name='supplierBondPaymentSaveHandler'>
      <f-form-item label='垫付金额' name='supplierBond' :value='formItem.supplierBond' :disabled='true' />
      <f-form-item label='收款账户' ref='bank' type='select' name='bankId' :params='params1' :data='api.supplierBank.list' valueKey='bankId' label-key='bankName' :required='true' :dropdown-render='true' @addItem='addSupplierBank' :auto-load='false' @change='bankChange' />
      <f-form-item label='备注' name='remark' :value='formItem.remark' />
      <a-descriptions bordered size='small' :column='1' v-if='bankInfo.supplierName'>
        <a-descriptions-item label='收款单位'>
          {{ bankInfo.supplierName }}
        </a-descriptions-item>
        <a-descriptions-item label='企业代码'>
          {{ bankInfo.taxNumber }}
        </a-descriptions-item>
        <a-descriptions-item label='收款人'>
          {{ bankInfo.linkMan }}
        </a-descriptions-item>
        <a-descriptions-item label='收款银行'>
          {{ bankInfo.bankName }}
        </a-descriptions-item>
        <a-descriptions-item label='收款账户'>
          {{ bankInfo.bankNo }}
        </a-descriptions-item>
        <a-descriptions-item label='联系方式'>
          {{ bankInfo.linkTel }}
        </a-descriptions-item>
        <a-descriptions-item label='企业地址'>
          {{ bankInfo.address }}
        </a-descriptions-item>
      </a-descriptions>
    </f-form>
    <a-modal title="添加银行账户" :visible="bankModal" width="600px" @cancel="handleCancel" @ok="supplierBankSubmit">
      <f-form ref="form" :action="api.supplierBank" :form-key="this.supplierBankForm.bankId">
        <f-form-item label="银行名称" name="bankName" :required="true" :value="supplierBankForm.bankName"/>
        <f-form-item label="银行卡号" name="bankNo" :required="true" :value="supplierBankForm.bankNo"/>
        <f-form-item label="收款人" name="linkMan"  :value="supplierBankForm.linkMan"/>
        <f-form-item label="联系方式" name="linkTel" :value="supplierBankForm.linkTel"/>
        <f-form-item label="备注" name="remark" :value="supplierBankForm.remark"/>
      </f-form>
    </a-modal>
  </div>
</template>

<script>
import api from "../js/api"

export default {
  name: "OrderSupplierBond",
  components: {},
  data() {
    let me = this
    //操作按钮
    let operator = []
    return {
      api: Object.assign(api, this.api),
      //列表初始化查询参数
      queryParam: {},
      loaded: false,
      bankInfo: {},
      bankModal:false,
      params1: {
        supplierId: "",
        bankType: 1
      },
      supplierBankForm:{},
      formItem: this.getFormItem()

    }
  },
  created() {
  },
  methods: {
    getFormItem() {
      return {
        orderId: "",
        supplierBond: 0,
        bankId: "",
        supplierId: "",
        title: ""
      }
    },
    setData(data) {
      if (data && data.orderId) {
        this.formItem = data
        this.$nextTick(() => {
          this.$refs["bank"].initData({ supplierId: data.supplierId, bankType: 1 })
        })
      }
    },
    bankChange(value) {
      this.http.get(this, {
        url: this.api.supplierBank.getBankInfo,
        params: {
          bankId: value
        },
        success: function(me, data) {
          me.bankInfo = data
        }
      })
    },
    addSupplierBank() {
      this.bankModal = true
    },
    supplierBankSubmit() {
      this.$refs.form.submit({ supplierId: this.formItem.supplierId,bankType: 1}, this.handleCancel)
    },
    handleCancel() {
      this.bankModal = false
      this.$refs["bank"].initData({ supplierId: this.formItem.supplierId, bankType: 1 })
    },
    handleSubmit() {
      let params = {
        orderId: this.formItem.orderId,
        amount: this.formItem.supplierBond,
        supplierId: this.formItem.supplierId,
        orderDetailsId:this.formItem.orderDetailsId,
        amountType: "SupplierBond"
      }
      this.$refs["supplierBondForm"].submit(params, this.handleSuccess)
    },
    handleSuccess() {
      this.$emit("closeDrawer", false)
    }
  }
}
</script>